<template>
  <div>
    <div id="login"></div>
    <div class="login_bg">
      <div style="height: 32px"></div>
      <form action="">
        <div class="userName b-line">
          <label>用户名：</label>
          <input type="text" name="name" placeholder="请输入用户名"
          v-model="form.username" >
        </div>
        <div class="passWord b-line">
          <label>密&nbsp;&nbsp;&nbsp;码：</label>
          <input type="password" name="password" placeholder="请输入密码"
         v-model="form.password">
        </div>
        <div class="choose_box">
          <div>
            <input
              type="checkbox"
              :checked="form.checked"
              name="checkbox"
              style="-webkit-appearance:checkbox "
              ref="checkbox"
            />
            <label>记住密码</label>
          </div>
          <a href="javascript:;" @click="toAuthRoute('/find','login')">忘记密码</a>
        </div>
        <div style="text-align:left;clear:both" @click="navigateTo('/register')">无账号？去注册</div>
        <button class="login_btn" type="button" @click="submit">登&nbsp;&nbsp;录</button>
      </form>
      <!-- <div class="other_login">
        <div class="other"></div>
        <span>其他方式登录</span>
        <div class="other"></div>
      </div>
      <div class="other_choose">
        <a href="">
          <img src="static/picture/qq.png" alt="" />
        </a>
        <a href="">
          <img src="static/picture/wx.png" alt="" />
        </a>
        <a href="">
          <img src="static/picture/wb.png" alt="" />
        </a>
      </div> -->
    </div>
  </div>
</template>

<script>
import {User} from '../../mockApi/user';
export default {
  data() {
    return {
      form:{
        username:'',
        password:'',
        checked: false
      },
      hasLogin:false //是否登录
    }
  },
  methods:{
    submit(){
      let that=this;
      let {username,password}= that.form;
      User.login({username,password}).then(res=>{
        console.log(res);
        let token='test1122';
        that.$store.dispatch('saveToken',token);
        //存储用户名
        that.$store.dispatch('saveUser',that.form.username);
        // 跳转到from路由
        let redirect=that.$route.query.redirect;
        if(redirect){
        // 若存在重定向，跳转到重定向
        that.$router.replace({path:redirect})
        }else{
          that.$router.replace({path:'index'})
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
</style>